---
title: "VS Code"
description: "Connect Strata with VS Code in minutes and supercharge your AI coding experience"
---
<img
  className="block dark:hidden"
  src="/images/knowledge-base/vs_code/VS_Code.png"
  alt="VS Code IDE"
/>
<img
  className="hidden dark:block"
  src="/images/knowledge-base/vs_code/VS_Code.png"
  alt="VS Code IDE"
/>

## Quick Setup Guide

<Steps>
  <Step title="Authorize MCP Servers to Use with Strata">
    Navigate to the [Klavis home page](https://www.klavis.ai/home) and click **"MCP Server"** in the left sidebar. You will see a list of MCP servers available in Klavis.

    <img
      src="/images/knowledge-base/vs_code/step1.png"
      alt="Klavis home page"
    />    
    Click the **"Authorize"** button next to your chosen server. Once server is authorized, you will see **Green Checkmark** status.

    <img
      src="/images/knowledge-base/vs_code/step2.png"
      alt="Authorize MCP Servers"
    />

    <Tip>
      You can authorize one or more servers to use with Strata
    </Tip>

  </Step>

  <Step title="Configure VS Code IDE with Strata">

    <Tabs>
      <Tab title="Via Dashboard">

        From Klavis Dashboard, click **Add to VS Code** and you will be redirected to VS Code IDE.

        <img
      src="/images/knowledge-base/vs_code/step3.png"
      alt="Copy Strata Server URL"
       />

        VS Code will automatically open the **MCP** dialog with Strata Server URL pre-filled. Click **Install** to save the configuration.

        <img
      src="/images/knowledge-base/vs_code/step4.png"
      alt="Install Strata in VS Code"
       />
      </Tab>

      <Tab title="Via Code">

        Copy Your Strata URL, open **Command Palette** in VS Code settings:
    - **macOS**: `Cmd + Shift + P`
    - **Windows/Linux**: `Ctrl + Shift + P`
    - Or **Settings > Command Palette > Preferences: Open User Setting (JSON)**

    <img
      src="/images/knowledge-base/vs_code/step5.png"
      alt="VS Code IDE Settings"
    />
    
    Paste Your Server URL to **settings.json** file like the screenshot below


    <img
      src="/images/knowledge-base/vs_code/step6.png"
      alt="Open User Setting (JSON) in VS Code"
    />
    <img
      src="/images/knowledge-base/vs_code/step7.png"
      alt="settings.json file in VS Code IDE"
    />
        

      </Tab>
    </Tabs>

    <Tip>
      You can add **Single** MCP Server URL directly here as well:

      1. Navigate to **Target Server** and click **Three Dots** next to your server
      2. Tap **Show Individual Server URL** and copy the URL
      3. Paste this URL in VS Code settings as described above

    </Tip>



    <Accordion title="🔐 OAuth Services (Most Common)">
      - Automatically redirected to OAuth authorization
      - Sign in to your account (GitHub, Google, Slack, etc.)
      - Grant necessary permissions
      - Redirected back to Klavis automatically
    </Accordion>
    
    <Accordion title="🔑 API Key Services">
      - Prompted to enter an API key
      - Follow service-specific instructions to generate key
      - Paste key in the provided field
      - Click **"Save"** to continue
    </Accordion>
  </Step>

  <Step title="Verify Tools Loading">
    In Github Copilot Chat, open **"Configure Tools"** (Tools icon) and scroll down to **MCP Server: klavis-strata**. You will see the list of available tools in Strata.
    <img
      src="/images/knowledge-base/vs_code/step8.png"
      alt="Strata Tools loading in VS Code"
    />
    
    <Note>
      As a prerequisite, you should have **GitHub Copilot Chat** extension installed in your VS Code IDE.
    </Note>
    
  </Step>

  <Step title="Start Using in Github Copilot Chat inside VS Code IDE">
    <img
      src="/images/knowledge-base/vs_code/step9.jpg"
      alt="Using MCP Server in Github Copilot Chat"
    />
    
    Open Chat (`Cmd/Ctrl + I`) and start using natural language:
    
    <CodeGroup>
    ```text GitHub
    "Create a new issue titled 'Add dark mode' with priority label"
    ```
    
    ```text Slack
    "Send a message to #general: 'Standup meeting in 5 minutes!'"
    ```
    
    ```text Gmail
    "Send email to john@company.com about project update"
    ```
    
    ```text Notion
    "Create a new page called 'Meeting Notes' with today's date"
    ```
    </CodeGroup>
    
    <Tip>
      🎯 Github Copilot Chat automatically detects when to use **Strata** based on context - no need to specify explicitly!
    </Tip>
  </Step>

  <Step title="Happy Building! 🎉">
    You're all set! Your **Strata** is now integrated with Github Copilot in VS Code IDE.
  </Step>
</Steps>

## Troubleshooting

<AccordionGroup>
  <Accordion title="🔧 Tools Not Appearing">
    - Double-check your Server URL for typos
    - Ensure stable internet connection
    - Verify authentication in Klavis dashboard
    - Check VS Code logs (View → Output → GitHub Copilot) for errors
    - Try completely restarting VS Code IDE
  </Accordion>
  
  <Accordion title="🔐 Authentication Issues">
    - Re-authenticate in the Klavis dashboard
    - Check if your OAuth tokens have expired
    - Verify API key permissions (for API key services)
    - Ensure you've granted all necessary permissions
  </Accordion>
  
  <Accordion title="⚡ Performance Issues">
    - Limit the number of active MCP servers
    - Check your internet connection speed
    - Restart VS Code IDE periodically
    - Contact support if issues persist
  </Accordion>
</AccordionGroup>

## Need Help?

<CardGroup cols={2}>
  <Card title="Community" icon="discord">
    Join our Discord for community support and discussions
  </Card>
  <Card title="Support" icon="headphones">
    Contact our technical support team for assistance
  </Card>
</CardGroup>

---